<!DOCTYPE html>
<html>
 <head lang="en"> 
  <meta charset="UTF-8" /> 
  <title>注册</title> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
  <meta name="format-detection" content="telephone=no" /> 
  <meta name="renderer" content="webkit" /> 
  <meta http-equiv="Cache-Control" content="no-siteapp" /> 
  <link rel="stylesheet" href="/AmazeUI-2.4.2/assets/css/amazeui.min.css" /> 
  <link href="/css/dlstyle.css" rel="stylesheet" type="text/css" /> 
  <script src="/AmazeUI-2.4.2/assets/js/jquery.min.js"></script> 
  <script src="/AmazeUI-2.4.2/assets/js/amazeui.min.js"></script> 
 </head> 
 <body> 
  <div class="login-boxtitle"> 
   <a href="home/demo.html"><img alt="" src="/images/logobig.png" /></a> 
  </div> 
  <div class="res-banner"> 
   <div class="res-main"> 
    <div class="login-banner-bg">
     <span></span>
     <img src="/images/big.jpg" />
    </div> 
    <div class="login-box"> 
     <div class="am-tab-panel am-active"> 
        <form method="post"> 
         <div class="user-name">
		   <label for="user"><i class="am-icon-user"></i></label> 
		   <input type="text" name="username" id="username" placeholder="请输入用户名">
		 </div>
         <div class="user-email"> 
          <label for="email"><i class="am-icon-envelope-o"></i></label> 
          <input type="email" name="email" id="email" placeholder="请输入邮箱账号" /> 
         </div> 
         <div class="user-phone"> 
          <label for="phone"><i class="am-icon-mobile-phone am-icon-md"></i></label> 
          <input type="tel" name="mobile" id="mobile" placeholder="请输入手机号" /> 
         </div> 
         <div class="verification"> 
          <label for="code"><i class="am-icon-code-fork"></i></label> 
          <input type="tel" name="verifyCode" id="verifyCode" placeholder="请输入验证码" /> 
            <a class="btn" href="javascript:void(0);" id="sendMobileCode"> <span id="dyMobileButton">获取</span></a> 
         </div>
         <div class="user-pass"> 
          <label for="password"><i class="am-icon-lock"></i></label> 
          <input type="password" name="password" id="password" placeholder="设置密码" /> 
         </div> 
         <div class="user-pass"> 
          <label for="passwordRepeat"><i class="am-icon-lock"></i></label> 
          <input type="password" id="passwordRepeat" placeholder="确认密码" /> 
         </div> 
         </form>
         <div class="login-links"> 
          <label for="reader-me"> <input id="reader-me" type="checkbox" /> 点击表示您同意商城《服务协议》 </label> 
         </div> 
         <div class="am-cf"> 
          <input type="button" value="注册" class="am-btn am-btn-primary am-btn-sm am-fl J_register" /> 
         </div> 
       </div>
    </div> 
   </div> 
   <#include "./inc/footer.html"/>
   <script>
      var timer,timeout = 180;
	  $(function() {
		 $('#doc-my-tabs').tabs();
		 $('.J_register').on('click',function(){
			 var password = $('#password').val().trim();
			 if(password == ''){
				 alert('密码不能为空');
				 return;
			 }
			 if(password != $('#passwordRepeat').val().trim()){
				 alert('两次密码不一致');
				 return;
			 }
			 var $this = $(this),$form = $this.parent().parent().find('form');
			 var params = {};
				var dataArrays = $form.serializeArray();
				if(dataArrays){
					$.each( dataArrays, function(i, field){
						if(field.value && field.value != ''){					
						  params[field.name] = field.value;
						}
					});
				}
			 $.ajax({
					dataType:"json",
				    type: "POST",
			        url: './register',
			        contentType: "application/json",
			        data:JSON.stringify(params),
					success: function(data){
				        if(data.code==200){
				           setTimeout(function(){window.location.href = './login';},500);
				        }else{
				        	alert(data.msg);
				        }
				    },
					error: function(xhr, type){
						alert('注册错误');
					}
				});
		 });
		 
		 $('#dyMobileButton').on('click',function(){
			    var $btn = $(this);
			    if(timeout > 0 && timeout < 180)return;
			    var mobileNo = $("#mobile").val();
			    if(mobileNo == ''){
			       alert("手机号码不能为空");	
			       return;
			    }
			    $.ajax({
				 url : '/common/send_code?to='+mobileNo,
				 type: 'POST',
				 contentType: 'application/json',
				 success : function(json) {
				  if(json.code == 200){
					timer = setInterval(function() {
						timeout--;
						if (timeout == 0) {
							clearInterval(timer);
							$btn.html('获取');
							btn.disabled = false;
						} else {
							$btn.html(timeout+'秒');
						}
					}, 1000, "");
				  }else{
					  alert( json.msg);	
				   }
				 }
			  });
		 });
	  });
  </script>  
  </div>
 </body>
</html>